/**
 * 组件通过 Component 方法来创建
 */
Component({
  /**
   * 外部拓展类声明
   */
  externalClasses: ['wr-class'],

  /**
   * properties 选项与 Vue props 选项一样，做 props 的声明的
   */
  properties: {
    goodsList: {
      type: Array,
      value: [], // 与 default 类似
    },
    id: {
      type: String,
      value: '',
      // 监听
      observer: (id) => {
        this.genIndependentID(id);
      },
    },
    thresholds: {
      type: Array,
      value: [],
    },
  },

  /**
   * 组件自身的数据
   */
  data: {
    independentID: '',
  },

  /**
   * 生命周期
   */
  lifetimes: {
    // 在组件在视图层布局完成后执行
    ready() {
      console.log('===', this);
      this.init();
    },
  },

  /**
   * 函数
   */
  methods: {
    onClickGoods(e) {
      const { index } = e.currentTarget.dataset;
      this.triggerEvent('click', { ...e.detail, index });
    },

    /**
     * 添加购物车
     */
    onAddCart(e) {
      console.log('=== e', e);
      const { index } = e.currentTarget.dataset;
      this.triggerEvent('addcart', { ...e.detail, index });
    },

    onClickGoodsThumb(e) {
      const { index } = e.currentTarget.dataset;
      this.triggerEvent('thumb', { ...e.detail, index });
    },

    init() {
      this.genIndependentID(this.id || '');
    },

    genIndependentID(id) {
      if (id) {
        this.setData({ independentID: id });
      } else {
        this.setData({
          independentID: `goods-list-${~~(Math.random() * 10 ** 8)}`,
        });
      }
    },
  },
});
